import  React,{memo} from 'react';
import "../../../../assets/Layout/rizhi.scss"
import { Button, Dropdown, Tabs, TabsProps ,Space,Input} from 'antd'
import { FontSizeOutlined,DownOutlined, SmileOutlined ,
  CaretDownOutlined,CaretRightOutlined,AudioOutlined } from '@ant-design/icons';
import type { SearchProps } from 'antd/es/input/Search';
import type { MenuProps } from 'antd';
import RzList from './rzList'
import {useNavigate} from "react-router";

function RizhiList(){
  const items: TabsProps['items'] = [
    {
      key: '1',
      label: '全部',
    },
    {
      key: '2',
      label: '评论时间',
    },
    {
      key: '2',
      label: '最新修改',
    },
    {
      key: '3',
      label: '评论数量',
    }
    ]
  const onChange = (key: string) => {
    console.log(key);
  };
  const { Search } = Input;
  const onSearch = (value)=>{}
  const  lsitFun = (<RzList></RzList>)
  const navigate = useNavigate();
  const onClickAddRz = () => {
    navigate('/konJian/AddRz');
  }

 return <>
   <div className="rizhi-main-box">
       <div className="rzhi-box-l">
          <div className="rzhi-top">
            <div>
              <Button onClick={()=>onClickAddRz()} className="rzhi-but" type="primary">
                <FontSizeOutlined className="icon"/>
                写日志</Button>
            </div>
            <div className="rzhi-r-div">
              <Dropdown menu={{ items }}>
                <Space>
                  全部
                  <CaretDownOutlined className="icon"/>
                </Space>
              </Dropdown>
            </div>
          </div>
         {lsitFun}
       </div>
     <div className="rzhi-box-r">
        <div className="rzhi-r-list">
           <div className="rizhi-item">
             <div className="rz-t">日志分类</div>
             <div className="rz-t1">管理</div>
           </div>
          <div className="rizhi-item rzh-1">
            <div className="rz-t2">全部日志</div>
            <div className="rz-t1">（0）</div>
          </div>
          <div className="rizhi-item rzh-1">
            <div className="rz-t2">个人日志</div>
            <div className="rz-t1">（0）</div>
          </div>
          <div className="rizhi-item rzh-1">
            <div className="rz-t2">图片日志</div>
            <div className="rz-t1">（0）</div>
          </div>
          <div className="rizhi-item rzh-1">
            <div className="rz-t2">其他日志分类 <CaretRightOutlined /></div>
          </div>
        </div>
       <div className="rzhi-ss-box">
         <Search placeholder="搜索日志"
                 enterButton
                 onSearch={onSearch} />
       </div>
     </div>

   </div>
 </>
}

export default memo(RizhiList);
